<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css"
			integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
		<!-- <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script> -->
		<script src="../js/jquery-3.7.1.js"></script>
		<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js"
			integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous">
		</script>
		<style>
			/* tr, td{
				outline: none !important;
			} */
		</style>
	</head>
	<body>
		<div class="container-fluid">
			<div class="row">
				<div class="col-md-10">
					<!-- 搜索区域 -->
					<div class="panel panel-default">
						<div class="panel-heading">搜索</div>
						<div class="panel-body">
							<form class="form-inline">
								<div class="form-group">
									<label for="name">字段</label>
									<select name="key" class="form-control" id="">
										<option value="username">宿舍</option>
										<option value="name">学号</option>
										<option value="telephone">姓名</option>
									</select>

								</div>
								<div style="margin-left: 20px;" class="form-group">
									<label for="value">值</label>
									<input style="width: 130px;" type="text" class="form-control"
										id="exampleInputEmail2" placeholder="">
								</div>
								<div class="form-group" style="margin-left: 40px;">
									<button class="btn btn-ms btn-info"> <span
											class="glyphicon glyphicon-zoom-in"></span>搜索
									</button>
								</div>
								<!-- <div class="form-group" style="margin-left: 40px;">
									<button type="button" class="btn btn-ms btn-primary" data-toggle="modal" data-target="#addModal"><span
											class="glyphicon glyphicon-plus"></span>添加宿舍
									</button>
								</div> -->
								<!-- <div class="form-group" style="margin-left: 40px;">
									<button class="btn btn-danger"><span class="glyphicon glyphicon-minus"></span>迁出
									</button>
								</div> -->
							</form>
						</div>
					</div>
					<!-- 列表展示 -->
					<div>
						<table class="table table-striped table-hover">
							<thead>
								<tr>
									<th><input type="checkbox">全选</th>
									<th>ID</th>
									<th>姓名</th>
									<th>宿舍号</th>
									<th>迁出原因</th>
									<th>迁出日期</th>
									
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>
										<input type="checkbox">
									</td>
									<td>1</td>
									<td>高启强</td>
									<td>870</td>
									<td>毕业</td>
									<td>2024-3-29</td>
								
									<td>
										<button type="button" class="btn btn-info btn-xs">详情</button>
										<!-- <button type="button" class="btn btn-warning btn-xs btn-primary" data-toggle="modal" data-target="#updateModal">编辑</button> -->
										<!-- <button type="button" class="btn btn-danger btn-xs">迁出</button> -->
									</td>
									<td></td>
								</tr>
								<tr>
									<td>
										<input type="checkbox">
									</td>
									<td>2</td>
									<td>高启盛</td>
									<td>871</td>
									<td>毕业</td>
									<td>2024-4-29</td>
								
									<td>
										<button type="button" class="btn btn-info btn-xs">详情</button>
										<!-- <button type="button" class="btn btn-warning btn-xs btn-primary" data-toggle="modal" data-target="#updateModal">编辑</button> -->
										<!-- <button type="button" class="btn btn-danger btn-xs">迁出</button> -->
									</td>
									<td></td>
								</tr>
							</tbody>
						</table>

						<nav aria-label="...">
							<ul class="pagination">
								<li class="disabled">
									<span>
										<span aria-hidden="true">&laquo;</span>
									</span>
								</li>
								<li class="active">
									<span>1 <span class="sr-only">(current)</span></span>
								</li>
								<li class="">
									<span>2 <span class="sr-only">(current)</span></span>
								</li>
								<li class="">
							  <span>3 <span class="sr-only">(current)</span></span>
								</li>
								<li class="">
									<span>4 <span class="sr-only">(current)</span></span>
								</li>
								<li class="disabled">
									<span>
										<span aria-hidden="true">&raquo;</span>
									</span>
								</li>
							</ul>
						</nav>

					</div>
				</div>
			</div>
		</div>
		
		
		
	</body>
</html>
